<template>
  <view class="email_edit">
    <view class="email_edit_top">
      <up-input
        placeholder="请输入"
        maxlength="15"
        class="up_input"
        v-model="userInfo.nickname"
        border="bottom"
        clearable
      ></up-input>
      <span>*请设置15个英文字符</span>
    </view>
    <view class="email_edit_bottom">
      <up-button type="primary" class="up_btn" shape="circle" text="更换昵称" @click="editNickName"></up-button>
    </view>
  </view>
</template>
  <script setup>
import { userApi } from "../../api";

onLoad((options) => {
  console.log("options", options.nickname);
  userInfo.value.nickname = options.nickname;
});
const userInfo = ref({
  nickname: "",
  address: "",
  email: "",
  avatar: ""
});
const editNickName = () => {
  if (userInfo.value.nickname == "") {
    uni.showToast({
      title: "请输入昵称",
      icon: "none"
    });
    return;
  }
  userApi.userinfoedit(userInfo.value).then((res) => {
    if (res.code == 1) {
      uni.showToast({
        title: res.msg,
        icon: "none"
      });
      // getUserInfo();
      uni.navigateBack();
    }
    if (res.code == 0) {
      uni.showToast({
        title: res.msg,
        icon: "none"
      });
    }
  });
};
</script>

  <style lang="scss" scoped>
.email_edit {
  height: 100%;
  width: 100%;
  box-sizing: border-box;
  padding: 60rpx 32rpx;
  .email_edit_top {
    .up_input {
      height: 74rpx;
      border-radius: 0rpx 0rpx 0rpx 0rpx;
      opacity: 1;
    }
    span {
      height: 44rpx;
      font-size: 32rpx;
      font-family: PingFang SC-Medium, PingFang SC;
      font-weight: 500;
      color: rgba(0, 0, 0, 0.87);
      line-height: 38rpx;
      margin-top: 32rpx;
      display: inline-block;
    }
  }
  .email_edit_bottom {
    position: fixed;
    bottom: 60rpx;
    left: 32rpx;
    width: 686rpx;
    .up_btn {
      height: 88rpx;
      background: #306eff;
      border-radius: 44rpx 44rpx 44rpx 44rpx;
      font-size: 32rpx;
      font-family: PingFang SC-Bold, PingFang SC;
      font-weight: bold;
      color: #ffffff;
    }
  }
}
</style>